<!DOCTYPE html>
<html xmlns:v-on="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <link rel="stylesheet" href="../css/currency/bootstrap.css"/>
    <link href="../css/H-ui.min.css" rel="stylesheet" type="text/css"/>
    <link href="../css/H-ui.admin.css" rel="stylesheet" type="text/css"/>
    <link href="../css/style.css" rel="stylesheet" type="text/css"/>
    <link href="../lib/Hui-iconfont/1.0.1/iconfont.css" rel="stylesheet" type="text/css"/>
    <link rel="stylesheet" href="../css/recipe.css"/>
    <title>实时在线率图表</title>
</head>
<script src="https://cdn.staticfile.org/vue/2.4.2/vue.min.js"></script>
<script src="../js/echarts.min.js"></script>
<script src="../js/utils/jquery-1.11.1.min.js"></script>
<body>
<form>
    <div style="padding-bottom: 30px;padding-top:15px;padding-left: 1%">
        <input class="btn btn-primary" type="button" name="今天" onclick="onlineNumber('1')" value="今天">
        <input class="btn btn-primary" type="button" name="最近一周" onclick="onlineNumber('2')" value="最近一周">
        <input class="btn btn-primary" type="button" name="最近一月" onclick="onlineNumber('3')" value="最近一月">
    </div>
</form>
<div id="gaikuangDiv" style="height: 600px; width: 100%;"></div>
<div class="pd-20" id="todayOffLine">
    <div class="text-c" id="equipmentOnlineTimeList">
        <form>
            <table id="today" class="table table-border table-bordered table-bg">
                <thead>
                <tr class="text-c">
                    <th nowrap="nowrap" colspan="5">离线设备明细</th>
                </tr>
                <tr class="text-c">
                    <th nowrap="nowrap">门店号</th>
                    <th nowrap="nowrap">设备编号</th>
                    <th nowrap="nowrap">电话</th>
                    <th nowrap="nowrap">离线时间</th>
                    <th nowrap="nowrap">地区</th>
                </tr>
                </thead>
                <tbody v-cloak>
                <tr class="text-c" v-for="(item,index) in pageInfo.list">
                    <td nowrap="nowrap">{{item.shopName}}</td>
                    <td nowrap="nowrap">{{item.equipmentCode}}</td>
                    <td nowrap="nowrap">{{item.contact}}</td>
                    <td nowrap="nowrap">{{item.onlineTime}}</td>
                    <td nowrap="nowrap">{{item.address}}</td>
                </tr>
                </tbody>
            </table>
            <table id="oneWeek" class="table table-border table-bordered table-bg">
                <thead>
                <tr class="text-c">
                    <th nowrap="nowrap" colspan="15">离线设备明细</th>
                </tr>
                <tr class="text-c">
                    <th nowrap="nowrap" rowspan="2">门店号</th>
                    <th nowrap="nowrap" rowspan="2">设备编号</th>
                    <th nowrap="nowrap" rowspan="2">离线次数</th>
                    <th nowrap="nowrap" rowspan="2">在线情况</th>
                    <th nowrap="nowrap" rowspan="2">地区</th>
                    <th nowrap="nowrap" rowspan="2">电话沟通情况</th>
                    <th nowrap="nowrap" rowspan="2">联系指导员情况</th>
                    <th nowrap="nowrap" rowspan="2">走访情况</th>
                    <th nowrap="nowrap" colspan="7">离线时间</th>
                </tr>
                <tr class="text-c" >
                    <th nowrap="nowrap" >{{days.day0}}</th>
                    <th nowrap="nowrap" >{{days.day1}}</th>
                    <th nowrap="nowrap" >{{days.day2}}</th>
                    <th nowrap="nowrap" >{{days.day3}}</th>
                    <th nowrap="nowrap" >{{days.day4}}</th>
                    <th nowrap="nowrap" >{{days.day5}}</th>
                    <th nowrap="nowrap" >{{days.day6}}</th>
                </tr>
                </thead>
                <tbody v-cloak>
                <tr class="text-c" v-for="(item,index) in pageInfo.list">
                    <td nowrap="nowrap">{{item.shopName}}</td>
                    <td nowrap="nowrap">{{item.equipmentCode}}</td>
                    <td nowrap="nowrap">{{item.sumOffLine}}</td>
                    <td nowrap="nowrap">{{item.onlineStatus}}</td>
                    <td nowrap="nowrap">{{item.address}}</td>
                    <td nowrap="nowrap">{{item.phoneCommunicationRecord}}</td>
                    <td nowrap="nowrap">{{item.instructorCommunicationRecord}}</td>
                    <td nowrap="nowrap">{{item.visitRecord}}</td>
                    <td nowrap="nowrap">{{item.score6}}</td>
                    <td nowrap="nowrap">{{item.score5}}</td>
                    <td nowrap="nowrap">{{item.score4}}</td>
                    <td nowrap="nowrap">{{item.score3}}</td>
                    <td nowrap="nowrap">{{item.score2}}</td>
                    <td nowrap="nowrap">{{item.score1}}</td>
                    <td nowrap="nowrap">{{item.score0}}</td>
                </tr>
                </tbody>
            </table>

            <table id="oneMonth" class="table table-border table-bordered table-bg">
                <thead>
                <tr class="text-c">
                    <th nowrap="nowrap" colspan="8">离线设备明细</th>
                </tr>
                <tr class="text-c">
                    <th nowrap="nowrap">门店号</th>
                    <th nowrap="nowrap">设备编号</th>
                    <th nowrap="nowrap">离线次数</th>
                    <th nowrap="nowrap">在线情况</th>
                    <th nowrap="nowrap">地区</th>
                    <th nowrap="nowrap">电话沟通情况</th>
                    <th nowrap="nowrap">联系指导员情况</th>
                    <th nowrap="nowrap">走访情况</th>
                </tr>
                </thead>
                <tbody v-cloak>
                <tr class="text-c" v-for="(item,index) in pageInfo.list">
                    <td nowrap="nowrap">{{item.shopName}}</td>
                    <td nowrap="nowrap">{{item.equipmentCode}}</td>
                    <td nowrap="nowrap">{{item.sumOffLine}}</td>
                    <td nowrap="nowrap">{{item.onlineStatus}}</td>
                    <td nowrap="nowrap">{{item.address}}</td>
                    <td nowrap="nowrap">{{item.phoneCommunicationRecord}}</td>
                    <td nowrap="nowrap">{{item.instructorCommunicationRecord}}</td>
                    <td nowrap="nowrap">{{item.visitRecord}}</td>
                </tr>
                </tbody>
            </table>

        </form>
        <div class="pageBox" v-cloak id="pageBox">
            <div class="pageInfo">显示 <span id="startRow">{{pageInfo.startRow}}</span> 到 <span
                    id="endRow">{{pageInfo.endRow}}条</span>&nbsp;&nbsp;&nbsp;&nbsp;{{pageInfo.pages}}页&nbsp;&nbsp;&nbsp;&nbsp;共
                <span id="total">{{pageInfo.total}}</span> 条
                <select v-model="selectedPageSize" v-on:change="getList('changePageSize')">
                    <option value="5">5</option>
                    <option value="10">10</option>
                    <option value="15">15</option>
                    <option value="20">20</option>
                    <option value="50">50</option>
                </select>
            </div>
            <ul class="pagination" id="pagination"></ul>
        </div>
    </div>
</div>
<script type="text/javascript" src="../js/common/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="../lib/layer/1.9.3/layer.js"></script>
<script type="text/javascript" src="../lib/laypage/1.2/laypage.js"></script>
<script type="text/javascript" src="../lib/icheck/jquery.icheck.min.js"></script>
<script type="text/javascript" src="../lib/Validform/5.3.2/Validform.min.js"></script>
<script type="text/javascript" src="../lib/My97DatePicker/WdatePicker.js"></script>
<script type="text/javascript" src="../js/common/H-ui.js"></script>
<script type="text/javascript" src="../js/common/H-ui.admin.js"></script>
<script type="text/javascript" src="../js/utils/utils.js"></script>
<script type="text/javascript" src="../js/currency/vue.js"></script>
<script type="text/javascript" src="../js/currency/vue-resource.min.js"></script>
<script type="text/javascript" src="../js/currency/base.js"></script>
<script type="text/javascript" src="../js/currency/jqPaginator.js"></script>
<script src="../js/equipmentOnlineNum.js"></script>
</body>
</html>
